<template>
	<view style="">
		<view class="note">

		</view>
		<u-navbar leftIconColor="#000000" :titleStyle="{ color: '#000000' }" :bgColor="bgColor" title="提现记录"
			:placeholder="true" :autoBack="true"></u-navbar>
		<view class=""
			style="position: relative;z-index: 1;background-color: #fff;width: 92%;margin: 15px auto;border-radius: 10px;">
			<view class="flex" style="position: relative;padding: 23px 15px 0;margin-bottom: 23px;">
				<text style="font-size: 14px;font-weight: 500;color: #333333;line-height: 18px;position: relative;z-index: 2;">账单明细</text>
				<view class="" style="width: 47px;
height: 3px;
background: linear-gradient(118deg, #6A82FF 0%, #8F8FFF 100%);
border-radius: 0px 0px 0px 0px;position: absolute;bottom: 3px;left: 30px;z-index: 1;">

				</view>
			</view>
			<view v-for="(it, i) in listdata" :key="i" style="
					padding: 15px;
					background-color: #fff;
					justify-content: space-between;
					display: flex;
					width: 92%;
					border-radius: 10px 10px 0 0;
					border-bottom: 1px solid #ececec;
				">
				<view style="width: 80%">
					<view style="font-size: 14px; color: #1d1f20; font-weight: 400">{{ it.zz_type }}</view>
					<view style="font-size: 12px; color: #979898; margin-top: 5px">
						{{ $u.timeFormat(it.createtime, 'yyyy-mm-dd hh:MM:ss') }}
					</view>
					<view v-if="it.status == 3"
						style="margin-top: 10px; font-size: 14px; color: #ff3331; font-weight: 400">
						驳回原因：{{ it.remark }}
					</view>
				</view>
				<view style="flex: 1; text-align: right">
					<view style="font-size: 14px; color: #1d1f20; font-weight: 400">{{ it.money }}元</view>
					<view style="font-size: 12px; font-weight: 400; color: #3176ff; margin-top: 5px">
						{{ it.status == 1 ? '待审核' : it.status == 2 ? '提现成功' : '被驳回' }}
					</view>
				</view>
			</view>

		</view>
		<u-loadmore v-if="show" :status="status" :loading-text="loadingText" :loadmore-text="loadmoreText"
			:nomore-text="nomoreText" />
	</view>
</template>

<script>
	export default {
		data() {
			return {
				show: false,
				listdata: [],
				date_info: [],
				page: 1,
				limit: 15,
				status: 'loadmore',
				loadingText: '努力加载中',
				loadmoreText: '轻轻上拉',
				nomoreText: '实在没有了',
				bgColor: 'rgba(255,255,255,0)',
			};
		},
		onReachBottom() {
			this.show = true;
			if (this.date_info == '') return;
			this.status = 'loading';
			this.page = ++this.page;
			this.list();
		},
		onPageScroll(e) {
			if (e.scrollTop > 50) {
				this.bgColor = 'rgba(255,255,255,1)'
			} else {
				this.bgColor = 'rgba(255,255,255,0)'
			}
		},
		onLoad() {
			this.list();
		},
		methods: {
			async list() {
				let res = await this.$http.index.withdrawlist({
					page: this.page,
					limit: this.limit,
				});
				console.log(res);
				if (res.code == 1) {
					this.date_info = res.data;
					setTimeout(() => {
						if (this.date_info == '') this.status = 'nomore';
						else this.status = 'loading';
					}, 1000);
					this.listdata = [...this.listdata, ...this.date_info];
				}
			},
		},
	};
</script>

<style scoped lang="less">


	.note {
		background-image: url('@/static/font/21.png');
		position: fixed;
		width: 100%;
		height: 100%;
		top: 0;
		background-size: 100% 100%;
	}
</style>
<style>
	page {
		background-color: #f7f9fa;
	}
</style>